<template>
	<view v-if="props.list && props.list.length > 0" class="cu-list menu-avatar">
		<view @click="handleSelect(item)" v-for="(item, index) in list" :key="index" class="cu-item cur">
			<view class="cu-avatar radius lg image_220" :style="{ backgroundImage: 'url(' + item.coverUrl + ');' }">
				<view class="cu-tag badge margin-top-xs">浏览{{ item.readNum }}人</view>
			</view>
			<view class="content">
				<view>
					<view class="text-cut text-size-30">{{ item.name }}</view>
				</view>
				<view class="text-grey text-sm margin-top-xs text-sigle">{{ item.description }}</view>
				<view class="text-grey text-sm flex ">
					<view class="text-cut">
						发布人：
						<text class="cuIcon-locationfill text-orange margin-right-xs"></text>
						{{ item.shopName }}
					</view>
				</view>
				<view class="text-grey text-sm flex ">
					<view class="text-cut">发布时间：{{ item.releaseTime }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { useSettingStore } from '@/stores/index';
	const setting = useSettingStore();
	const emit = defineEmits(['action']);
	const props = defineProps({
		isCard: {
			type: [Boolean, String],
			default: false
		},
		list: {
			default: () => {
				return [
					{
						id: 24,
						shopName: '测试AA',
						shopPhone: '',
						latitude: '1111',
						longitude: '111',
						shopAddress: '测试',
						orderCode: '23030618070894193410',
						state: 0,
						buyTime: '2023-03-06 18:07:09',
						price: 18.0,
						couponPrice: 0.0,
						expressPrice: 2.0,
						distributionType: 1,
						accountName: '孙秋',
						accountPhone: '18716643045',
						accountAddress: '四川省成都市龙泉驿区酱园街2号',
						remark: '',
						goodsList: [
							{
								id: 24,
								name: '半素套餐',
								num: 1,
								goodsTypeId: null,
								goodsTypeName: null,
								price: 16.0,
								weight: null,
								coverUrl: 'http://www.hblue.top:48099/img/2023-01-22/06fec762117747fe91e22e3c30a35fa1.jpeg',
								remark: null,
								sort: null,
								createTime: '2023-03-06 18:07:09'
							}
						]
					}
				];
			}
		}
	});
	const handleSelect = (e : any) => {
		emit('action', e);
	};
</script>

<style lang="scss" scoped>
	.cu-list.menu-avatar>.cu-item {
		position: relative;
		display: flex;
		padding-right: 10rpx;
		height: 240rpx;
		background-color: #ffffff;
		justify-content: flex-end;
		align-items: center;
	}

	.cu-list.menu-avatar>.cu-item .content {
		position: absolute;
		left: 300rpx;
		width: calc(100% - 120rpx - 60rpx - 120rpx - 20rpx);
		height: 100%;
		padding-top: 40rpx;
	}

	.cu-avatar.lg {
		width: 260rpx;
		height: 180rpx;
		font-size: 2em;
	}
</style>